<template>
  <div class="page getPosition">
    <div id="container"></div>
    <div id="panel"></div>
  </div>
</template>

<script>
import Vue from "vue";
import customHeader from "../../components/header/header";
import { Field, Toast, MessageBox } from "mint-ui";
export default {
  name: "getPosition",
  data() {

    return {

        };
  },
  methods: {
    handleBack(){

    },
    submit(){

    }
  },
  mounted: function() {
    var map = new AMap.Map('container',{
    });

    map.plugin('AMap.Geolocation', function() {
    var geolocation = new AMap.Geolocation({
      // 是否使用高精度定位，默认：true
      enableHighAccuracy: true,
      // 设置定位超时时间，默认：无穷大
      timeout: 10000,
      //  定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
      zoomToAccuracy: true,
      //  定位按钮的排放位置,  RB表示右下
      buttonPosition: 'RB',

      // circleOptions:new AMap.Circle({
      //   map:map,
      //   radius:20
      // })
    })
    map.addControl(geolocation);
    geolocation.getCurrentPosition()
    AMap.event.addListener(geolocation, 'complete', onComplete)

    function onComplete (data) {
      // data是具体的定位信息
      const currentLat = data.position.lat;
      const currentLon = data.position.lng;
      var marker = new AMap.Marker({
　　　　　　　　　　position: data.position, // （e.position）--->定位点的点坐标, position ---> marker的定位点坐标，也就是marker最终显示在那个点上，
　　　　　　　　　　icon: '', // marker的图标，可以自定义，不写默认使用高德自带的
　　　　　　　　　　map: map,  // map ---> 要显示该marker的地图对象
　　　　　　　　})
        AMap.service(["AMap.PlaceSearch"], function() {
         //构造地点查询类
         var placeSearch = new AMap.PlaceSearch({
             type: '餐饮服务', // 兴趣点类别
             pageSize: 5, // 单页显示结果条数
             pageIndex: 1, // 页码
             city: "010", // 兴趣点城市
             citylimit: true,  //是否强制限制在设置的城市内搜索
             map: map, // 展现结果的地图实例
             panel: "panel", // 结果列表将在此容器中进行展示。
             autoFitView: true // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
         });

         var cpoint = data.position; //中心点坐标
         placeSearch.searchNearBy('', cpoint, 200, function(status, result) {

         });
        });
      };
      var env = {
        '是否移动设备':AMap.Browser.mobile,
        '是否触摸设备':AMap.Browser.touch,
        '是否高清屏':AMap.Browser.retina,
        '是否安卓设备':AMap.Browser.android,
        '是否 iOS 设备':AMap.Browser.ios,
        '是否 Windows 系统':AMap.Browser.windows,
        '是否 iMac 系统':AMap.Browser.mac,
        '是否 IE678':AMap.Browser.ielt9,
        '是否支持 Canvas':AMap.Browser.isCanvas,
        '是否支持 WebGL':AMap.Browser.isWebGL(),
        '是否支持 SVG':AMap.Browser.isSvg,
        '是否支持 WebWorker':AMap.Browser.isWorker,
        '是否支持 WebSocket':AMap.Browser.isWebsocket,
        'User-Agent':AMap.Browser.ua,
        '其他':'还有很多有用字段'
    }
    })
  },
  components: {
    customHeader,

  }
};
</script>
<style lang='scss' scoped>
@import "getPosition";
</style>
